import 'package:flutter/material.dart';
import 'package:flutter_study/flutter/_09%E8%B7%AF%E7%94%B1%E5%AF%BC%E8%88%AA/pages/unknown_page.dart';

import 'pages/Product.dart';

void main() => runApp(MyApp());

/*
* 页面跳转用到的两个类：
*  1.Route:路由定义
*  2.Navigator:跳转操作，管理所有Route
*
* 定义路由的规范是在不同页面定义自己的路由名称
* */
class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      // 定义路由，静态定义
      debugShowCheckedModeBanner: false,
      // 去掉页面debug标识
      routes: {
        // 主页、根路由
        "/": (ctx) => HomePage(),
        "/page2": (BuildContext context) => Page2(),
      },
      // 例如跳转到 /product,如果路由映射表不存在，则从该函数查找，携带的参数放在settings中
      onGenerateRoute: (RouteSettings settings) {
        if (settings.name == '/product') {
          return MaterialPageRoute(
              builder: (ctx) => ProductPage(
                    arguments: settings.arguments,
                  ));
        }
        return null;
      },
      // 使用了路由，不能直接在materialApp中，需要抽取Widget
      // 配置了根路由就不需要home属性
      // home: HomePage(),
      initialRoute: "/",
      onUnknownRoute: (settings) {
        return MaterialPageRoute(builder: (ctx) {
          return UnknownPage();
        });
      },
    );
  }
}

class HomePage extends StatelessWidget {
  const HomePage({
    Key key,
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('页面跳转'),
      ),
      body: Column(
        children: [
          RaisedButton(
            // 可以使用Navigator的静态方法，也可以使用of方法获取对象调用对象方法
            onPressed: () => Navigator.of(context).pushNamed("/page2",
                arguments:
                    "你好，page2") /* Navigator.pushNamed(context, '/page2')*/,
            child: Text('静态路由传参'),
          ),
          RaisedButton(
            // 动态路由，用于带参数跳转和接收参数
            onPressed: () => Navigator.push(
                context, MaterialPageRoute(builder: (context) => Page3())),
            child: Text('构建/动态路由'),
          ),
          ToPage4Widget(),
          RaisedButton(
            //打开的一个页面是异步的，页面返回回来的数据通过Future返回,使用await获取真实结果
            onPressed: () async {
              var result = await Navigator.push(
                  context, MaterialPageRoute(builder: (_) => Page5()));
              debugPrint("result=$result");
            },
            child: Text('跳转page5并接收数据'),
          ),
          ElevatedButton(
              onPressed: () async {
                Navigator.of(context)
                    .pushNamed("/product", arguments: {"id": "test1"});
              },
              child: Text('命名路由参数传递')),
          ElevatedButton(
              onPressed: () {
                Navigator.of(context).pushNamed("/xxx");
              },
              child: Text('未知界面')),
        ],
      ),
    );
  }
}

// 带参数页面跳转以及接收参数
class ToPage4Widget extends StatefulWidget {
  @override
  _ToPage4WidgetState createState() => _ToPage4WidgetState();
}

class _ToPage4WidgetState extends State<ToPage4Widget> {
  String name;

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Text(
          "${name ?? 'waiting'}",
          style: Theme.of(context).textTheme.headline5,
        ),
        RaisedButton(
          child: Text('数据传递'),
          onPressed: () => Navigator.push(context,
                  MaterialPageRoute(builder: (context) => Page4('fauks')))
              .then((value) {
            setState(() {
              name = value;
            });
          }),
        )
      ],
    );
  }
}

class Page2 extends StatelessWidget {
  // 定义该页面的路由名称
  static const String routeName = "/page2";

  @override
  Widget build(BuildContext context) {
    // 获取从上个页面携带的参数
    final String message = ModalRoute.of(context).settings.arguments as String;

    return Scaffold(
      appBar: AppBar(
        title: Text('page2'),
      ),
      body: RaisedButton(
        child: Text('$message'),
        // pop返回之前的页面
        onPressed: () => Navigator.pop(context, null),
      ),
    );
  }
}

class Page3 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('page3'),
      ),
      body: RaisedButton(
        child: Text('退出'),
        // pop返回之前的页面
        onPressed: () => Navigator.pop(context, null),
      ),
    );
  }
}

// 接收页面数据和返回数据
// 从上一个页面跳转过来 appbar默认带返回按钮，有时候我们想返回并带参数，实现方式：
// 1.自定义appbar的返回按钮：leading 实现自定义逻辑
// 2.嵌套WillPopScope实现相关逻辑
class Page4 extends StatelessWidget {
  final String name;

  Page4(this.name);

  @override
  Widget build(BuildContext context) {
    return WillPopScope(
      onWillPop: () {
        _backToHome(context);
        // 返回false自己处理返回逻辑，true Flutter处理返回逻辑
        return Future.value(false);
      },
      child: Scaffold(
        appBar: AppBar(
          title: Text('page4'),
          // 页面跳转过来默认带返回按钮，我们自己定义返回图片好控制返回事件
          /* leading: IconButton(
            icon: Icon(Icons.arrow_back_ios),
            onPressed: () => _backToHome(context),
          ),*/
        ),
        body: Column(
          children: [
            Text('姓名：$name'),
            RaisedButton(
              child: Text('返回数据'),
              // pop返回之前的页面
              onPressed: () => _backToHome(context),
            ),
          ],
        ),
      ),
    );
  }

  void _backToHome(BuildContext context) {
    Navigator.pop(context, '我是页面4');
  }
}

class Page5 extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return Container(
      child: RaisedButton(
        child: Text('返回数据'),
        onPressed: () => Navigator.pop(context, "我是页面5返回的数据"),
      ),
    );
  }
}
